<html>
<head>
    <title>Snake</title>
    <link href="css/style.css" type="text/css" rel="stylesheet">
    <!-- Script includes go here -->
    <script src="jslib/debug.js"></script>
    <script src="jslib/webgl/turbulenzengine.js"></script>
    <script src="jslib/webgl/graphicsdevice.js"></script>
    <script src="jslib/webgl/inputdevice.js"></script>
    <script src="jslib/draw2d.js"></script>
</head>
<body>
    <div>
	<div id="insertHere"></div>
    <canvas id="canvas" width="640px" height="480px"/>
    <script>
        /* Game code goes here */
		if (!window.WebGLRenderingContext) {
		var element = document.getElementById("canvas");
		element.parentNode.removeChild(element);
		} else {
        TurbulenzEngine = WebGLTurbulenzEngine.create({
            canvas: document.getElementById("canvas")
        });

        var graphicsDevice = TurbulenzEngine.createGraphicsDevice({});
        var inputDevice = TurbulenzEngine.createInputDevice({});
        var draw2D = Draw2D.create({
            graphicsDevice: graphicsDevice
        });

        var r = 0.2, g = 0.2, b = 0.2, a = 1.0;
        var bgColor = [r, g, b, a];

//        var x1 = 0;
//        var y1 = 0;
//        var x2 = 30;
//        var y2 = 30;
//
//        var drawObject = new Array();
//        for (var i=0;i<20;i++){
//            drawObject.push({color: [1.0, 0.0, 0.0, 1.0],destinationRectangle: [x1, y1, x2, y2]});
//            x1 += 32;
//            x2 += 32;
//        }

        
//        var sprite = Draw2DSprite.create({
//            width: 32,
//            height: 32,
//            x: start_x,
//            y: start_y,
//            color: [1.0, 1.0, 1.0, 1.0],
//            rotation: 0
//        });
//
//        var texture = graphicsDevice.createTexture({
//            src: "sprites/head.png",
//            mipmaps: true,
//            onload: function (texture)
//            {
//                if (texture)
//                {
//                    sprite.setTexture(texture);
//                    sprite.setTextureRectangle([0, 0, texture.width, texture.height]);
//                }
//            }
//        });
        var tex_head = graphicsDevice.createTexture({
            src: "sprites/head.png",
            mipmaps: true
        });
        var tex_body = graphicsDevice.createTexture({
            src: "sprites/body.png",
            mipmaps: true
        });
        var tex_food = graphicsDevice.createTexture({
            src: "sprites/food.png",
            mipmaps: true
        });
        var tex_body1 = graphicsDevice.createTexture({
            src: "sprites/body1.png",
            mipmaps: true
        });
        var tex_body2 = graphicsDevice.createTexture({
            src: "sprites/body2.png",
            mipmaps: true
        });
        
        
        var start_x = 10*32+16;
        var start_y = 7*32+16;
        var snakeSprite = new Array();
        
        snakeSprite.push(Draw2DSprite.create({
            texture : tex_head,
            width: 32,
            height: 32,
            x: start_x,
            y: start_y,
            color: [1.0, 1.0, 1.0, 1.0],
            rotation: 0
        }));
        snakeSprite.push(Draw2DSprite.create({
            texture : tex_body,
            width: 32,
            height: 32,
            x: start_x+32,
            y: start_y,
            color: [1.0, 1.0, 1.0, 1.0],
            rotation: 0
        }));
        snakeSprite.push(Draw2DSprite.create({
            texture : tex_body,
            width: 32,
            height: 32,
            x: start_x+64,
            y: start_y,
            color: [1.0, 1.0, 1.0, 1.0],
            rotation: 0
        }));
        
        var randomXBlock = Math.floor((Math.random()*20));
        var randomYBlock = Math.floor((Math.random()*15));
        var food_x = randomXBlock * 32 + 16;
        var food_y = randomYBlock * 32 + 16;
        var food = Draw2DSprite.create({
            texture : tex_food,
            width: 32,
            height: 32,
            x: food_x,
            y: food_y,
            color: [1.0, 1.0, 1.0, 1.0],
            rotation: 0
        })
        var up = 0, down = 0, left = 1, right = 0;

        var time = 0;
        
        var gameSpeed = 11; //less is faster
        
           //Cache keyCodes
        var keyCodes = inputDevice.keyCodes;
        
        var onKeyDown = function onKeyDownFn(keycode)
        {
            if (keycode === keyCodes.NUMPAD_ADD)
            {
                if(gameSpeed > 3){
                    gameSpeed -= 2;  
                }
            }
            if (keycode === keyCodes.NUMPAD_SUBTRACT)
            {
                if(gameSpeed < 17){
                    gameSpeed += 2;  
                }
            }
            if (keycode === keyCodes.LEFT || keycode === keyCodes.A)
            {
                if((snakeSprite[0].x - snakeSprite[1].x) <= 0){
                    left = 1;
                    right = 0;
                    up = 0;
                    down = 0;
                }
            }
            else if (keycode === keyCodes.RIGHT || keycode === keyCodes.D)
            {
                if((snakeSprite[0].x - snakeSprite[1].x) >= 0){
                    left = 0;
                    right = 1;
                    up = 0;
                    down = 0;
                }
            }
            else if (keycode === keyCodes.UP || keycode === keyCodes.W)
            {
                if((snakeSprite[0].y - snakeSprite[1].y) <= 0){
                    left = 0;
                    right = 0;
                    up = 1;
                    down = 0;
                }
            }
            else if (keycode === keyCodes.DOWN || keycode === keyCodes.S)
            {
                if((snakeSprite[0].y - snakeSprite[1].y) >= 0){
                    left = 0;
                    right = 0;
                    up = 0;
                    down = 1;
                }
            }
        };
        inputDevice.addEventListener('keydown', onKeyDown);
        
        var score = 0;
        var ate = 0;
        var last_x = 0;
        var last_y = 0;
        
        var gameOver = false;
        function update() {
            /* Update code goes here */
            inputDevice.update();
            time += 1;
            if (time >= gameSpeed){
                if(left === 1){
                    for(var i = snakeSprite.length-1; i > 0; i--){
                        snakeSprite[i].x = snakeSprite[i-1].x;
                        snakeSprite[i].y = snakeSprite[i-1].y; 
                    }
                    if(snakeSprite[0].x !== 16){
                        snakeSprite[0].x = snakeSprite[0].x - 32;
                    } else {
                        snakeSprite[0].x = 640-16;
                    }
                }
                if(right === 1){
                    for(var i = snakeSprite.length-1; i > 0; i--){
                        snakeSprite[i].x = snakeSprite[i-1].x;
                        snakeSprite[i].y = snakeSprite[i-1].y;
                    }
                    if(snakeSprite[0].x !== 640-16){
                        snakeSprite[0].x = snakeSprite[0].x + 32;
                    } else {
                        snakeSprite[0].x = 16;
                    }
                }
                if(up === 1){
                    for(var i = snakeSprite.length-1; i > 0; i--){
                        snakeSprite[i].x = snakeSprite[i-1].x;
                        snakeSprite[i].y = snakeSprite[i-1].y;
                    }
                    if(snakeSprite[0].y !== 16){
                        snakeSprite[0].y = snakeSprite[0].y - 32;
                    } else {
                        snakeSprite[0].y = 480-16;
                    }
                }
                if(down === 1){
                    for(var i = snakeSprite.length-1; i > 0; i--){
                        snakeSprite[i].x = snakeSprite[i-1].x;
                        snakeSprite[i].y = snakeSprite[i-1].y;
                    }
                    if(snakeSprite[0].y !== 480-16){
                        snakeSprite[0].y = snakeSprite[0].y + 32;
                    } else {
                        snakeSprite[0].y = 16;
                    }
                }
                time = 0;
            }
            if (ate === 1){
                snakeSprite.push(Draw2DSprite.create({
                    texture : tex_body,
                    width: 32,
                    height: 32,
                    x: last_x,
                    y: last_y,
                    color: [1.0, 1.0, 1.0, 1.0],
                    rotation: 0
                }));
                ate = 0;
            }
            if (snakeSprite[0].x === food.x && snakeSprite[0].y === food.y){
                var overlap = true;
                while (overlap){
                    for(var i = 0; i < snakeSprite.length-1; i++){
                        if (food_x === snakeSprite[i].x && food_y === snakeSprite[i].y){
                            randomXBlock = Math.floor((Math.random()*20));
                            randomYBlock = Math.floor((Math.random()*15));
                            food_x = randomXBlock * 32 + 16;
                            food_y = randomYBlock * 32 + 16;
                        } else {
                            overlap = false;
                        }
                    }
                }
                
                
                food.x = food_x;
                food.y = food_y;
                score += 100;
                document.getElementById("leftSide").innerHTML="Score: " + score + " Press +/- to adjust speed.";
                ate = 1;
                last_x = snakeSprite[snakeSprite.length-1].x;
                last_y = snakeSprite[snakeSprite.length-1].y;
            }
            for(var i = 1; i < snakeSprite.length - 1; i++){
                    if((snakeSprite[0].x === snakeSprite[i].x) && (snakeSprite[0].y === snakeSprite[i].y)){
                        gameOver = true;
                    }
                }
            if (graphicsDevice.beginFrame())
            {
                if(!gameOver){
                    graphicsDevice.clear(bgColor, 1.0);
                    /* Rendering code goes here */

                    draw2D.begin();
                    draw2D.drawSprite(food);
                    for (var i=0;i<snakeSprite.length;i++)
                    {
                        draw2D.drawSprite(snakeSprite[i]);
                    }
        //                draw2D.drawSprite(sprite);
                    draw2D.end();


                    graphicsDevice.endFrame();
                } else {
                    bgColor[0] = 0.0;
                    bgColor[1] = 0.0;
                    bgColor[2] = 0.0;
                    graphicsDevice.clear(bgColor, 1.0);
                    document.getElementById("leftSide").innerHTML="GAME OVER!";
                }
            }
        }

        TurbulenzEngine.setInterval(update, 1000 / 60);
		}
    </script>
    </div>
    <div class="sides" id="leftSide">Score = 0 Press +/- to adjust speed.</div>
	<script>
		if (!window.WebGLRenderingContext) {
			document.getElementById("leftSide").innerHTML="Your browser does not support WebGL technology.";
		}
	</script>
	
</body>
</html>